/**
 * 注册页面JavaScript
 */

document.addEventListener('DOMContentLoaded', function() {
    // 初始化表单验证
    initFormValidation();
    
    // 添加用户名失焦时的验证
    document.getElementById('username').addEventListener('blur', checkUsernameAvailability);
});

/**
 * 初始化表单验证
 */
function initFormValidation() {
    const registerForm = document.getElementById('registerForm');
    
    // 添加表单提交事件
    registerForm.addEventListener('submit', function(event) {
        event.preventDefault();
        
        // 验证表单
        if (validateForm()) {
            submitForm();
        }
    });
    
    // 添加密码确认验证
    document.getElementById('confirmPassword').addEventListener('input', function() {
        validatePasswordMatch();
    });
    
    // 添加密码输入验证
    document.getElementById('password').addEventListener('input', function() {
        validatePassword();
        validatePasswordMatch();
    });
}

/**
 * 验证表单
 * @returns {boolean} 表单是否有效
 */
function validateForm() {
    let isValid = true;
    
    // 验证用户名
    const username = document.getElementById('username').value;
    if (!username || username.length < 3) {
        showError('username', '用户名至少需要3个字符');
        isValid = false;
    } else {
        clearError('username');
    }
    
    // 验证密码
    if (!validatePassword()) {
        isValid = false;
    }
    
    // 验证确认密码
    if (!validatePasswordMatch()) {
        isValid = false;
    }
    
    // 验证邮箱（如果提供）
    const email = document.getElementById('email').value;
    if (email && !isValidEmail(email)) {
        showError('email', '请输入有效的电子邮箱地址');
        isValid = false;
    } else {
        clearError('email');
    }
    
    // 验证手机号（如果提供）
    const mobile = document.getElementById('mobile').value;
    if (mobile && !isValidMobile(mobile)) {
        showError('mobile', '请输入有效的手机号码');
        isValid = false;
    } else {
        clearError('mobile');
    }
    
    return isValid;
}

/**
 * 验证密码
 * @returns {boolean} 密码是否有效
 */
function validatePassword() {
    const password = document.getElementById('password').value;
    
    if (!password) {
        showError('password', '请输入密码');
        return false;
    } else if (password.length < 6) {
        showError('password', '密码至少需要6个字符');
        return false;
    } else {
        clearError('password');
        return true;
    }
}

/**
 * 验证密码匹配
 * @returns {boolean} 密码是否匹配
 */
function validatePasswordMatch() {
    const password = document.getElementById('password').value;
    const confirmPassword = document.getElementById('confirmPassword').value;
    
    if (password && confirmPassword && password !== confirmPassword) {
        showError('confirmPassword', '两次输入的密码不一致');
        return false;
    } else {
        clearError('confirmPassword');
        return true;
    }
}

/**
 * 检查用户名是否可用
 */
function checkUsernameAvailability() {
    const username = document.getElementById('username').value;
    
    if (!username || username.length < 3) {
        return;
    }
    
    // 发送请求检查用户名是否可用
    fetch('/api/auth/check-username', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json'
        },
        body: JSON.stringify({ username: username })
    })
    .then(response => response.json())
    .then(data => {
        if (data.code !== 200) {
            showError('username', data.message || '用户名已存在');
        } else {
            clearError('username');
        }
    })
    .catch(error => {
        console.error('检查用户名可用性时出错:', error);
    });
}

/**
 * 提交注册表单
 */
let isSubmitting = false; // 添加全局提交状态标志

function submitForm() {
    // 如果已经在提交中，直接返回防止重复提交
    if (isSubmitting) {
        console.log('表单正在提交中，请勿重复点击');
        return;
    }
    
    const username = document.getElementById('username').value;
    const password = document.getElementById('password').value;
    const confirmPassword = document.getElementById('confirmPassword').value;
    const realName = document.getElementById('realName')?.value || '';
    const email = document.getElementById('email').value;
    const mobile = document.getElementById('mobile').value;
    const role = document.getElementById('role').value;
    
    // 显示加载状态
    const registerButton = document.getElementById('registerButton');
    registerButton.disabled = true;
    registerButton.classList.add('btn-loading');
    
    // 设置提交状态为true
    isSubmitting = true;
    
    // 设置超时恢复，防止网络问题导致按钮永久禁用
    const submitTimeout = setTimeout(() => {
        if (isSubmitting) {
            resetSubmitState();
            showAlert('warning', '网络请求超时，请稍后再试');
        }
    }, 10000); // 10秒超时
    
    // 准备请求数据
    const registerData = {
        username: username,
        password: password,
        confirmPassword: confirmPassword,
        realName: realName,
        email: email,
        mobile: mobile,
        role: role
    };
    
    // 发送注册请求
    fetch('/api/auth/register', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json'
        },
        body: JSON.stringify(registerData)
    })
    .then(response => response.json())
    .then(data => {
        // 清除超时
        clearTimeout(submitTimeout);
        
        // 恢复按钮状态
        resetSubmitState();
        
        if (data.code === 200) {
            // 注册成功
            showAlert('success', '注册成功，即将跳转到登录页面');
            
            // 3秒后跳转到登录页
            setTimeout(() => {
                window.location.href = '/login';
            }, 3000);
        } else {
            // 注册失败，显示错误信息
            showAlert('error', data.message || '注册失败，请稍后再试');
        }
    })
    .catch(error => {
        // 清除超时
        clearTimeout(submitTimeout);
        
        // 恢复按钮状态
        resetSubmitState();
        
        // 显示错误信息
        showAlert('error', '注册请求失败，请稍后再试');
        console.error('注册错误:', error);
    });
}

/**
 * 重置提交状态
 */
function resetSubmitState() {
    const registerButton = document.getElementById('registerButton');
    registerButton.disabled = false;
    registerButton.classList.remove('btn-loading');
    isSubmitting = false;
}

/**
 * 显示表单错误信息
 * @param {string} fieldId 字段ID
 * @param {string} message 错误消息
 */
function showError(fieldId, message) {
    const errorElement = document.getElementById(`${fieldId}-error`);
    if (errorElement) {
        errorElement.textContent = message;
    }
}

/**
 * 清除表单错误信息
 * @param {string} fieldId 字段ID
 */
function clearError(fieldId) {
    const errorElement = document.getElementById(`${fieldId}-error`);
    if (errorElement) {
        errorElement.textContent = '';
    }
}

/**
 * 显示提示信息
 * @param {string} type 提示类型 (success, error, warning, info)
 * @param {string} message 提示消息
 */
function showAlert(type, message) {
    const alertContainer = document.getElementById('alertContainer');
    if (!alertContainer) return;
    
    const alertElement = document.createElement('div');
    alertElement.className = `alert alert-${type}`;
    alertElement.innerHTML = `<span>${message}</span>`;
    
    // 清除现有提示
    alertContainer.innerHTML = '';
    alertContainer.appendChild(alertElement);
    
    // 3秒后自动隐藏
    setTimeout(() => {
        alertElement.remove();
    }, 3000);
}

/**
 * 验证邮箱格式
 * @param {string} email 邮箱地址
 * @returns {boolean} 是否有效
 */
function isValidEmail(email) {
    const re = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
    return re.test(email);
}

/**
 * 验证手机号格式
 * @param {string} mobile 手机号码
 * @returns {boolean} 是否有效
 */
function isValidMobile(mobile) {
    const re = /^1[3-9]\d{9}$/;
    return re.test(mobile);
} 